<template>
	<div id="price_wrapper">
		<!-- <market-table :showPriceTable="showPriceTable" :marketData="marketData" />

		<price-table
			:showPriceTable="showPriceTable"
			:priceTableData="priceTableData"
		/> -->

		<market-table :marketData="marketData" />

		<!-- <price-table
			:showPriceTable="showPriceTable"
			:priceTableData="priceTableData"
		/> -->
	</div>
</template>
<script>
	import salemarket from "@/api/salemarket"
	import { mapMutations, mapGetters } from "vuex"
	export default {
		data() {
			return {
				marketData: [],
				priceTableData: [],
			}
		},
		components: {
			"market-table": () => import("./components/marketTable.vue"),
			"price-table": () => import("./components/priceTable.vue"),
		},
		mounted() {
			this.fetch()
		},
		computed: {
			...mapGetters({
				// showPriceTable: "getPriceTableStatus",
			}),
		},
		created() {
			console.log(this.$router)
		},
		watch: {
			// $router: {
			// 	immediate: true,
			// 	deep: true,
			// 	handler(a, b) {
			// 		console.log(a, b)
			// 	},
			// },
		},
		destroyed() {
			console.log("组件销毁")
			// this.setPriceTableStatus(false)
		},
		methods: {
			...mapMutations({
				// setPriceTableStatus: "setPriceTableStatus",
			}),
			async fetch(params = {}) {
				this.marketData = []

				await salemarket.query(params).then((response) => {
					console.log("市场列表数据", response)
					if (response.code !== 1) {
						this.$message.warning(response.message)
						return
					}

					if (response.data && response.data.length > 0) {
						this.marketData = response.data.map((item) => {
							return {
								id: item.id,
								name: item.name,
							}
						})
					}
				})
			},
		},
	}
</script>
<style lang="less" type="text/less" scoped>
	#price_wrapper {
	}
</style>
